<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ page isELIgnored="false"%>
<%
    String path = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">


<title>李宁体育管理系统</title>

<link rel="shortcut icon" href="favicon.ico">
<link href="<%=path%>/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
<link href="<%=path%>/css/font-awesome.min93e3.css?v=4.4.0"
	rel="stylesheet">
<link href="<%=path%>/css/style.min862f.css?v=4.1.0" rel="stylesheet">
<link href="<%=path%>/css/plugins/chosen/chosen.css" rel="stylesheet">

<link
	href="<%=path%>/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css"
	rel="stylesheet">
<link href="<%=path%>/css/animate.min.css" rel="stylesheet">

</head>

<body class="gray-bg ">
	<div class="wrapper wrapper-content animated fadeInRight">
		<div class="row">
			<div class="col-sm-12">
				<div class="ibox float-e-margins">
				<form class="form-horizontal m-t"  novalidate="novalidate">
				<div class="goToSaveProblem">
				    <div class="ibox-title">
                        <h5>问题${account }</h5>
                    
                    <div class="ibox-tools">
                     <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>    
                    <div class="ibox-content">
                    
					<div class="form-group">
					<input type="hidden" id="activityId${account }" name="activityId${account }" value="${account }"></input>
						 <label
							class="col-sm-2 control-label">标题</label><font color="red">*</font>
						<div class="col-sm-3">
							<input type="text" class="form-control" name="title${account }" id="title${account }"
								maxlength="12" placeholder="请填写问题的标题"></input>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-2 control-label"></label>
						<div class="col-sm-3">
							<input type="radio" name="type${account }" id="type${account }" value="1"
								checked="checked"></input>&nbsp;&nbsp;单选
							&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="type${account }"
								id="type${account }" value="2"></input>&nbsp;&nbsp;多选
						</div>
					</div>
					<div class="feed-element">
						<div class="media-body ">
							<div class="form-group">
								<label class="col-sm-2 control-label"></label><font color="red"></font>
								<div class="col-sm-3">
									<a id="AddMoreFileBox" class="btn btn-info">添加选项</a>
								</div>
								<span id="errWt" style="color: red;"></span>
							</div>
							<div id="InputsWrapper"></div>
						</div>
					</div>
					</div>
					</form>
					</div>
					</div>
					<div class="form-group">
						<div class="col-sm-4 col-sm-offset-3">
							<button class="btn btn-primary pull-right"
								style="margin-left: 3px" type="button" id="saveTag">
								<i class="fa fa-check"></i>&nbsp;保存
							</button>

							<button class="btn btn-success pull-right"
								style="margin-left: 3px" type="button"
								onclick="goback()">
								<i class="fa fa-reply"></i> 返回
							</button>
						</div>
					</div>
				</div>
		</div>
	</div>
	</div>
	<script src="<%=path%>/js/jquery.min.js?v=2.1.4"></script>
	<script src="<%=path%>/js/bootstrap.min.js"></script>
	<script src="<%=path%>/js/plugins/layer/layer.js"></script>
	<script src="<%=path%>/js/jquery.serializeObject.js"></script>
	<script src="<%=path%>/js/plugins/ajaxfileupload.js"></script>
	<script type="text/javascript">
	var goback=function(){
		var index=parent.layer.getFrameIndex(window.name);

		parent.layer.close(index);
	}
	
	$(document).ready(function() {  
        var txtarr = ['一','二','三','四','五','六','七','八','九','十']
        var resetOptOrder = function () {
    		var ellist = $("#InputsWrapper .form-group .control-label");
    		for (var ii=0; ii<ellist.length; ii++) {
    			ellist.eq(ii).html('选项'+txtarr[ii]);
    		}
    	}
    	var MaxInputs = 9; 
    	var InputsWrapper = $("#InputsWrapper");  
    	var AddButton = $("#AddMoreFileBox"); 	  
    	var x = InputsWrapper.length;  
    	var FieldCount=1;  	
    	
     	
     	
    	$(AddButton).click(function (e)  
    	{  
    	        if(x <= MaxInputs)   
    	        {  
    	            FieldCount++; 	            
    	            $(InputsWrapper).append('<div class="form-group">'+
    	            
    	            '<label class="col-sm-2 control-label">选项'+txtarr[x - 1]+'</label><div class="col-sm-3"><input type="text"  name="wt${account }['+(x - 1)+']" id="wt_'+ FieldCount +'" class="form-control"/></input>'+
    	            '</div>'+
    	            
    	            
    	        	'<div class="ibox float-e-margins col-sm-8" style="margin-left:90px;margin-top:30px">'+
	    	        '<div class="form-group">'+
	    	        '<input class="filehidden" id="lefile'+ x +'" name="lefile'+ x +'" type="file" style="opacity: 0;" >'+ 
	    	        '<div class="col-sm-2">'+
	    	             '<a class="btn btn-info" onclick="$(\'input[id=lefile'+x+']\').click();">选择图片</a>'+
	    	             '</div>'+ 
	    	             '<div class="col-sm-4">'+
	    	            '<input id="photoCover'+x+'" name ="photoCover${account }'+x+'" class="input-large form-control" value="" type="text" style="height:30px;">'+  
	    	              '</div>'+
	    	              '<div class="file-box">'+
                          '<div class="file">'+
                              '<a>'+
                                  '<span class="corner"></span>'+
                                  '<div class="image" >'+
                                      '<img   id="img'+x+'" alt="" class="img-responsive" src="" style="width:100%;height:100%">'+
                                  '</div>'+
                             ' </a>'+
                          '</div>'+
                      '</div>'+
	    	        '</div>'+ 
	    	        '<a href="#" class="removeclass">删 除</a>&nbsp;&nbsp;&nbsp;&nbsp;'+
    	            '<span id="imgHint'+ x +'" class="removespan" style="color:red">图片比例1:1，建议尺寸120x120px</span>'+
	    	        '</div>'+
	    	        
	    	        '</div>'
    	            );
    	        	
    	        	$('input[id=lefile'+ x +']').change(function() { 
    	        		fileUpload(this,x);
					  $("#photoCover"+(x-1)+"").val($(this).val());   
					}); 
    	        	
    	            x++; 
    	            resetOptOrder();
    	        }
    	        
    	return false;  
    	});  	  
    	$("body").on("click",".removeclass", function(e){
    	        if( x > 1 ) {  
    	                $(this).parents('.form-group').remove();
    	                resetOptOrder();
    	                x--; 
    	                FieldCount--;
    	}  
    	return false;  
    	}); 
    	var formValue={};
    	$("#saveTag").click(function(){
    		var roleForm=$(".m-t").serializeObject();
    		var jsonForm=JSON.stringify((roleForm));
    		var dataObj=eval("("+jsonForm+")");
    		var title=dataObj.title${account };
    		var type=dataObj.type${account };
    		var oh=$(".goToSaveProblem").prop('outerHTML');
    		for(var zc=0;zc<x-1;zc++){
    			var ttry=zc+1;
    			var w= dataObj['wt${account }['+zc+']'];
    			var p=dataObj['photoCover${account }'+(zc+1)+''];
    			formValue["wt_"+(ttry+1)+""]=w;
    			formValue["photoCover"+(zc+1)+""]=p;
    			
    			console.log("w:"+w+";"+"p:"+p);
    			/*  $("input[id=wt_"+(ttry+1)+"]").val(w);
    			$("input[id=photoCover"+(zc+1)+"]").val(p);  */
    		}
    		/* console.log(jsonForm);
    		console.log("title:"+title);
    		console.log("type:"+type); */
    		formValue["title"]=title;
    		formValue["type"]=type;
    		
    		console.log("formValue:"+JSON.stringify((formValue)));
    		/* $(oh).find("#AddMoreFileBox").parent().parent().remove(); */
    		jQuery.ajax({
    			type: "post",
    		    url: "<%=path%>/activity/doAddVoteWt",
    		    dataType: "json",
    		    data: {"html":oh,"optionX":x},
    		    beforeSend:function() {
    		    	$("#progress").modal();
    		    	$("#loading").html("正在提交数据，请稍候...");
    		    	goback();

    		    },
    		    complete:function(data) {
    		    	$("#progress").modal('hide');
    		    	$("#loading").html("");
    		    }, 
    		    success: function (data) {
    		    	if(data.status==200){
    		    		parent.layer.msg("保存标签数据信息成功!",{time: 500},function(){});
    		    		window.parent.$("#Inputs").append(data.data);
    		    		window.parent.$("#AddMoreFileBox").parent().parent().remove();
    		    		window.parent.$(".removeclass").remove();
    		    		window.parent.$(".removespan").remove();
    		    		window.parent.$("#activityId${account }").parent().find("input[id=title${account }]").val(formValue.title);
    		    		for(var zc=0;zc<x-1;zc++){
    		    			var ttry=zc+1;
    		    			window.parent.$("#activityId${account }").parent().parent().find("input[id=wt_"+(ttry+1)+"]").val(formValue["wt_"+(ttry+1)+""]);
    		    			window.parent.$("#activityId${account }").parent().parent().find("input[id=photoCover"+(zc+1)+"]").val(formValue["photoCover"+(zc+1)+""]);
    		    			
    		    		}
    		    	
    		    		
    		    	}else{
    		    		alert(1);
    		    	}
    		    },
    		});
    		
    		
    	})
    	
    	}); 
	
	var	fileUpload = function(sender,x) {
		$.ajaxFileUpload({
			url : '<%=path%>/activity/voteFileUpload', // 用于文件上传的服务器端请求地址
			type : 'post',
			data : {
				"index":x,
				"extension" : ".png,.jpg,.jpeg"
			}, // JSON格式
			secureuri : false, // 一般设置为false
			fileElementId : 'lefile'+(x-1)+'', // 文件上传空间的id属性 <input type="file" id="file" name="file" />
			dataType : 'json', // 返回值类型 一般设置为json
			global : true,
			success : function(response, status) { // 服务器成功响应处理函数
			  if (response.status==200) {
				  $("#photoCover"+(x-1)+"").val(response.data);
				  $("#img"+(x-1)+"").attr("src",response.data);
					
				} 
			},
			error : function(data, status, e) {// 服务器响应失败处理函数
				/* _showInfoMessage(e, 'error'); */
			}
		});
	}
	</script>
</body>
</html>
